body, div, dl, dt, dd, ul, ol, li,h1, h2, h3, h4, h5, h6, pre, code,form, fieldset, legend, input, button,textarea, p, blockquote, th, td {margin: 0;padding: 0;}
fieldset, img {border: 0;}
:focus {outline: 0;}
address, caption, cite, code, dfn,em, th, var, optgroup {font-style: normal;font-weight: normal;}

h1, h2, h3, h4, h5, h6{font-size: 100%; font-weight: normal;}
abbr, acronym {border: 0;font-variant: normal;}
strong{font-weight: 700;}
input, button, textarea,
select, optgroup, option, i{font-family: inherit;font-size: inherit;	font-style: inherit;	font-weight: inherit;}
code, kbd, samp, tt {font-size: 100%;}
input, button, textarea, select {*font-size: 100%;}
body {line-height: 1.5;}
ol, ul {list-style: none;}
table {border-collapse: collapse;border-spacing: 0;}
caption, th {text-align: left;}
sup, sub {font-size: 100%;vertical-align: baseline;}
:link, :visited , ins {text-decoration: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: '';content: none;}
.fn-clear:after {	visibility:hidden;display:block;	font-size:0;content:" ";clear:both;	height:0;}
.fn-clear {zoom:1; /* for IE6 IE7 */}
body .fn-hide {display:none;}
.fn-left,.fn-right {display:inline;}
body .fn-left {float:left;}
body .fn-right {float:right;}

/***************** CSS Style ********************/
body{
	color: #333;
	font-size: 14px;
	line-height: 1.5;
	font-family: Arial, Helvetica, sans-serif;
	background-color: #f9f8f5;
}
a{text-decoration: none; color: #d14600;}
a:link{text-decoration: none;}
a:visited{text-decoration: none; }
a:hover { text-decoration: underline; color: #333;}
a:active{text-decoration: none;}


/* modal */
.modal{
	width: 860px;
	margin: 30px auto;	
	overflow: hidden;	
	border: 5px solid #fa7518;	
	background-color: #fa7518;
	border-radius: 8px;
	outline: none;
	position: relative;
	box-shadow: 0 2px 15px rgba(0,0,0,0.5);
}
	/* modal-header */
	.modal-header{		
		padding: 7px 10px;
		background-color: #fa7518;
		position: relative;
	}
		.modal-header h3{
			font-weight: 500;
			font-size: 20px;
			color: #fff;
		}
		/* close */
		button.close{
			color: #fff;
			font-family: Arial,Helvetica,sans-serif;
			font-weight: normal;
			width: 24px;
			height: 24px;
			font-size: 28px;
			line-height: 20px;
			text-align: center;
			overflow: hidden;
			background: none repeat scroll 0 0 rgba(0,0,0,0);
			border: 0 none;
			cursor: pointer;
			position: absolute;
			top: 5px;
			right: 5px;
			border-radius: 6px;
			-moz-transition: all 0.3s ease-out 0s;
			-webkit-transition: all 0.3s ease-out 0s;
			transition: all 0.3s ease-out 0s;		
			z-index: 9;
		}
		button.close:hover{
			opacity: 0.8;
			color: #fa7518;
			text-decoration: none;
			background-color: #fff;
		}
		
	/* modal-body */
	.modal-body{
		overflow: hidden;
		background-color: #fff;
		border-radius: 4px 4px 0 0;
	}	
	
	/* modal-footer */
	.modal-footer{
		overflow: hidden;
		padding: 15px;
		text-align: center;
		border-top: 1px solid #dbd9d5;
		background-color: #f5f5f5;
		box-shadow: inset 0 1px 0 #fff;
		border-radius: 0 0 4px 4px;
	}
		
/* btn */
.btn{
	display: block;
	height: 20px;
	line-height: 20px;
	overflow: hidden;
	padding: 9px 20px;
	font-size: 16px;
	margin: 0 auto;
	text-align: center;
	cursor: pointer;
	text-transform:uppercase;
	border-radius: 2px;
	color: #666;
	text-shadow:0 1px 0 #fff;
	border: 1px solid #ccc;
	background-color: #eee;
}

.btn:hover{
	text-decoration: none;
	border-color:#bbb;
	background-color: #e5e5e5;
	box-shadow: 0 0 2px rgba(0,0,0, 0.2);
}
.btn:active{
	box-shadow: 0 0 5px rgba(0,0,0,0.2) inset;
}

/* .btn */
.btn.disabled,
.btn.disabled:hover,
.btn.disabled:active{
	color: #999;
	text-shadow: 0 1px 0 #fff;
	border-color: #ddd;
	background: #eee;
	box-shadow: none;
	cursor: default;
}

/* btn-inline	 */
.btn-inline{
	display: inline-block;
}

/* btn-download */
.btn-download{
	margin-right: 10px;
}

/* btn-primary */
.btn-primary{
	color: #fff;
	text-shadow: 0 1px 0 #d14600;
	border-color: #d14600;
	background-color: #e25f1c;
}
.btn-primary:hover{
	color: #fff;
	border-color: #d14600;
	background-color: #d14600;
}
.btn-primary:active{
	color: #fff;
	background-color: #21355c \9;
}	

/* form-group */
.form-group:before,
.form-group:after { display: table; content: " ";}
.form-group:after { clear: both;}
.form-group:before,
.form-group:after { display: table; content: " ";}
.form-group:after { clear: both;}	

/* form-control */
.form-control:-moz-placeholder,
.form-control::-moz-placeholder,
.form-control:-ms-input-placeholder,
.form-control::-webkit-input-placeholder { color: #999;}
.form-control{
	display: block;
	width: 100%;
	height: 21px;
	padding: 6px 10px;
	font-size: 14px;
	line-height: 21px;
	color: #999;
	vertical-align: middle;	
	border: 1px solid #d1c9be;
	background-color: #f8f7f4;
	box-shadow: 0 1px 3px rgba(0,0,0,0.06) inset;
	border-radius: 2px;
	-webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
	        transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}
.form-control:focus{	
	color: #666;
	border-color: #b8a080;
	background-color: #fff;		  
}
	
/* checkbox */
.checkbox,.radio{
	display: block;
	cursor: pointer;
	text-align: left;
	font-size: 16px;
}	
.radio input[type="radio"], 
.checkbox input[type="checkbox"]{
	vertical-align: middle;
	margin: -1px 5px 0 0;
}		
	
/* pagination */	
.pagination{
	height: 40px;
}
	.pagination a,
	.pagination span,
	.pagination em{
		display: inline-block;
		height: 38px;
		line-height: 38px;
		padding: 0 19px;
		margin-left: 5px;
		text-transform:uppercase;
		vertical-align: middle;
		color: #333;
		font-size: 16px;
		border: 1px solid #d5ceb4;
		background-color: #f8f7f4;
		border-radius: 2px;
	}
	.pagination a:hover{
		color: #d14600;
		background-color: #dad5c2;
		text-decoration: none;
	}
	.pagination span.current{
		color: #d14600;
		border-width: 2px;
		border-color: #d14600;
		background-color: #fff;
		font-weight: 700;
		height: 36px;
		line-height: 36px;
		padding: 0 18px;
		font-size: 18px;
	}
	.pagination span.disabled{
		color: #ccc;
		text-shadow: 0 1px 0 #fff;
		border: 1px solid #e0e0e0;
		background-color: #f9f9f9;
		cursor: default;
	}
	.pagination em{
		padding: 0 3px;
		color: #666;
		font-weight: bold;
		border: 0;
		background: none;
	}
	.pagination .prev,
	.pagination .next{font-weight: 700;}
		
		
/* image-wall */
.image-wall,
.image-wall-item{
	width: 850px;
	height: 460px;
	overflow: hidden;
	margin: 5px;
	position: relative;
}
	/* image-wall-item */
	.image-wall-item{margin: 0;}
	.image-wall-node{
		width: 90px;
		height: 90px;
		overflow: hidden;
		position: absolute;
	}
		.image-wall-node span{
			display: block;
			position: absolute;
			top: 50%;
			left: 50%;
		}
		.image-wall-node img{
			display: block;
			overflow: hidden;
		}
		.image-wall-node a:hover img{
			filter:alpha(opacity=90);
			opacity: 0.90;
		}
		
	/* image-wall-inside */
	.image-wall-inside{
		width: 660px;
		height: 280px;
		position: absolute;
		top: 95px;
		left: 95px;
		z-index: 2;
	}
		/* image-wall-logo */
		.image-wall-logo{
			width: 660px;
			height: 200px;
			margin: 0 auto;
			overflow: hidden;
			text-align: center;
			line-height: 280px;
		}
		
		/* image-wall-search */
		.image-wall-search{
			width: 660px;
			height: 47px;
			margin-top: 5px;
			overflow: hidden;
			position: relative;
		}
			/* search-input */
			.search-input{
				width: 656px;
				height: 21px;
				line-height: 21px;
				padding: 10px 0;
				overflow: hidden;			
				color: #999;
				text-indent: 13px;
				text-shadow:0 1px 0 rgba(255,255,255,0.4);
				font-size: 18px;
				position: absolute;
				top: 0;
				left: 0;
				color: #999;
				border: 2px solid #b66631;
				box-shadow: 3px 3px 2px rgba(0,0,0,0.05) inset, 0 2px 2px rgba(0,0,0,0.1);
				background-color: #fcfcfc;
				-moz-transition: all 0.25s ease-in-out 0s;
				-webkit-transition: all 0.25s ease-in-out 0s;
				transition: all 0.25s ease-in-out 0s;			
				box-shadow: 0 1px 2px rgba(0,0,0,0.2) inset; 
			}
			.search-input:focus{
				color: #333;
				border-color: #b66631;
				background-color: #fff;
			}
			
			/* search-submit */
			.search-submit{
				width: 39px;
				height: 37px;
				overflow: hidden;
				cursor: pointer;
				border: 0 none;
				text-indent: -999px;
				background: url(../images/large-search.png) 0 0 no-repeat;
				position: absolute;
				right: 4px;
				top: 4px;			
			}	
			.search-submit:hover{
				filter:alpha(opacity=90);
				opacity: 0.90;
			}
			.search-submit:active{
				filter:alpha(opacity=100);
				opacity: 1;
			}
	
/* homepage-categories */
.homepage-categories{
	overflow: hidden;
	text-align: center;
	padding: 14px 10px 10px 10px;
	border-top: 1px solid #dbd9d5;
	background-color: #f9f9f9;
}
	/* homepage-tags */
	.homepage-tags{
		overflow: hidden;
		padding: 0 5px 0 12px;
	}
		/* .homepage-tags{ */
		.homepage-tags a{
			display: inline-block;
			height: 23px;
			line-height: 23px;
			overflow: hidden;
			padding: 0 13px;
			margin: 1px 2px;
			color: #333;
			font-size: 12px;
			border: 1px solid #d8d6df;
			background-color: #f9f8f4;
			border-radius: 4px;
			text-shadow: 0 1px 0 #fff;
		}
		.homepage-tags a:hover{
			color: #fff;
			text-decoration: none;
			border-color: #d14600;
			background-color: #d14600;
			text-shadow: 0 1px 0 #983300;
		}
		
/* search-modal */
.search-caption,
.breadcrumbs,
.detail-filter{
	padding: 15px;
	overflow: hidden;
	border-bottom: 1px solid #dbd9d5;
	background-color: #f9f9f9;
	border-radius: 6px 6px 0 0;
}	
	/* image-wall-search */
	.search-caption .image-wall-search{
		width: 630px;
		height: 45px;
		float: left;
		margin: 0;
	}
	.search-caption .image-wall-search .search-input{width: 626px;}	
	.search-caption .form-control{
		float: right;
		width: 165px;
		height: 45px;
		font-size: 16px;
	}
	
/* breadcrumbs */
.breadcrumbs{
	font-size: 16px;
	color: #999;
}	
	.breadcrumbs a{ text-decoration: underline;}
	.breadcrumbs em{ color: #666; margin: 0 10px;}
	.breadcrumbs p{ color: #666; float: right;}	
		
		
/* listing-modal */
.listing-modal{width: 835px;}		
.listing-wrapper{
	max-height: 515px;
	overflow: scroll;
	overflow-x: hidden;
}
		
/* search-thumbnail */
.thumbnail-group{overflow: hidden;margin: 15px 0 5px 5px;}
.thumbnail-group li{
	float: left;
	width: 150px;
	margin: 0 0 10px 10px;
	position: relative;
}	
	/* btn-primary */
	.thumbnail-group li .btn-primary{
		display: block;
		position: absolute;
		z-index: 5;
		top: -50px;
		right: 0;
		opacity: 0;
		padding: 1px 5px;
		height: inherit;
		line-height: 1;
		text-align: center;
		border-radius: 0 3px;
		font-size: 18px;
		font-family: Arial, Helvetica, sans-serif;
		-moz-transition: all 0.2s ease 0s;
		-webkit-transition: all 0.2s ease 0s;
		transition: all 0.2s ease 0s;		
	}
	.thumbnail-group li .btn-primary{
		top: 0;
		opacity: 1;
	}

	/* thumbnail-img */
	.thumbnail-img{
		display: block;
		width: 150px;
		height: 115px;
		overflow: hidden;
		position: relative;
	}
		.thumbnail-img img,
		.thumbnail-img span{
			display: block;
			position: absolute;
			top: 50%;
			left: 50%;
		}
		.thumbnail-img span img{
			position: relative;
			top: auto;
			left: auto;
		}

/* detail-modal */
.detail-modal{width: 980px;}		
		
/* detail-filter */
.detail-filter{
	overflow: hidden;
	font-size: 15px;
}
	/* alignment */
	.alignment{width: 180px;overflow: hidden; height: 60px;}
	.alignment-aspect{ width: auto; padding-right: 25px;}
	.alignment h5,
	.size-range h5,
	.size-range #size-max{
		color: #333;
		height: 24px;
		line-height: 24px;
		overflow: hidden;
		float: left;
	}
	.alignment h5{
		float: none;
		clear: both;
	}
		/* align-list */
		.align-list{
			width: 100%;
			overflow: hidden;
			padding-top: 7px;
		}
			.align-list li{float: left;padding: 0 15px 0 0;	}
			.align-list li a{ border-bottom: 1px dotted #666; color: #333;}
			.align-list li a:hover,
			.align-list li a.current{ border-bottom: 1px solid #d14600; color: #d14600; text-decoration: none; }
			.align-list li a:active{ color: #333;}

	/* size */
	.size-range{
		width: 300px;
		height: 60px;
		overflow: hidden;
		float: left;
	}
		.size-range #size-max{ float: right;}
		#slider-range{
			height: 5px;
			margin-top: 40px;
			border: 1px solid #ccc;
			background-color: #f5f5f5;
			border-radius: 5px;
			position: relative;
		}
			.ui-slider-range{
				height: 5px;
				overflow: hidden;
				background-color: #ddd;
				position: absolute;
			}
			.ui-slider-handle{
				display: block;
				width: 13px;
				height: 13px;
				overflow: hidden;
				position: absolute;
				margin: -6px 0 0 0;
				border: 1px solid #fff;
				background-color: #e25f1c;
				border-radius: 11px;
				box-shadow: 0 2px 3px rgba(0,0,0,0.3);
			}
			
	/* border-choose */
	.border-choose{
		width: 180px;
		overflow: hidden;
	}		
		.border-choose label{
			float: left;
			text-align: right;
			width: 90px;
			line-height: 30px;
			padding-right: 10px;
		}
		.border-choose .form-control{
			padding: 0 0 0 10px;
			height: 27px;
			line-height: 27px;
			width: 36px;
			float: left;
		}
		.border-choose span{
			line-height: 30px;
			padding-left: 5px;
		}
		
/* detail-preview */
.detail-preview{
	padding: 10px 15px 15px 15px;
	max-height: 410px;
	overflow: scroll;
	overflow-x: hidden;
}		

/* loading-modal */
.loading-modal{width: 500px;}
.loading-modal .modal-body{ text-align: center; padding: 35px 0;}
.loading-modal .modal-footer .btn{width: 120px;}

/* loading */
.loading{
	display: inline-block;
	font-size: 20px;
	line-height: 32px;
	padding-left: 40px;
	background: url(../images/loading.gif) 0 0 no-repeat;
}

/* create-modal */
.create-modal{width: 700px;}
.create-modal .create-radio,
.create-modal .create-radio .radio{width: 500px; display: block; text-align: left;}
.create-modal .detail-preview{
	padding: 15px;
	max-height: inherit;
	overflow: hidden;
}

/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/* 
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#fff;}
#colorbox{outline:0;}
    #cboxTopLeft{width:25px; height:0px;}
    #cboxTopCenter{height:0px;background:}
    #cboxTopRight{width:25px; height:0px;}
    #cboxBottomLeft{width:25px; height:0px;}
    #cboxBottomCenter{height:0px;}
    #cboxBottomRight{width:25px;}
    #cboxMiddleLeft{width:0px; background:url(../images/border.png) repeat-y 0 0;}
    #cboxMiddleRight{width:0px; background:url(../images/border.png) repeat-y -25px 0;}
    #cboxContent{background:#fff; overflow:hidden;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-bottom:20px;}
        #cboxTitle{position:absolute; bottom:0px; left:0; text-align:center; width:100%; color:#999;}
        #cboxCurrent{position:absolute; bottom:0px; left:100px; color:#999;}
        #cboxLoadingOverlay{background:#fff url(../images/loading.gif) no-repeat 5px 5px;}

        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
        
        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}

        #cboxSlideshow{position:absolute; bottom:0px; right:42px; color:#444;}
        #cboxPrevious{position:absolute; bottom:0px; left:0; color:#444;}
        #cboxNext{position:absolute; bottom:0px; left:63px; color:#444;}
        #cboxClose{position:absolute; bottom:0; right:0; display:block; color:#444;}

.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}	
